<template>
	<view class="empty" :style="[{'background': bgColor}]">
		<!-- 暂无权限 -->
		<image v-if="status=='power'" src="/static/images/power.png"></image>
		<!-- 暂无日程 -->
		<image v-else-if="status=='schedule'" src="/static/images/schedule.png"></image>
		<!-- 暂无数据/空数据 -->
		<image v-else src="/static/images/empty.png"></image>
		<!-- 提示内容 -->
		<view class="empty-tips" :style="[{'color': tipsColor}]">{{tips}}</view>
	</view>
</template>
<script>
	export default {
		name: "empty",
		props: {
			tips: {
				type: String,
				default: ''
			},
			tipsColor: {
				type: String,
				default: '#9C9C9C'
			},
			bgColor: {
				type: String,
				default: 'transparent'
			},
			status: {
				type: String,
				default: 'empty'
			},
		}
	}
</script>
<style>
	.empty {
		    position: fixed;
		    left: 0;
		    top: 400rpx;
		    width: 100%;
		    height: 60vh;
		    padding-bottom: 120rpx;
		    display: flex;
		    justify-content: center;
		    flex-direction: column;
		    align-items: center;
		    box-sizing: border-box;
	}

	.empty image {
		width: 500rpx;
		height: 500rpx;
	}

	.empty .empty-tips {
		display: flex;
		font-size: 30rpx;
		color: #999999;
	}
</style>
